<template>
	<div class="boxmain">
		<h3>生成留痕阅卷<el-button type="primary" @click="resorego">刷新进度</el-button></h3> 
		<el-table
		    :data="tableData"
		    border
		    style="width: 100%">
		    <el-table-column
		      prop="name"
		      label="报表级别"
		      width="180">
		    </el-table-column>
		    <el-table-column
		      label="学校"
		      width="180">
			  <template slot-scope="scope">
				  联考留痕
				  <span style="font-size:12px;color:#999;display: block;">{{scope.row.schoolNum}}个学校</span>
			  </template>
		    </el-table-column>
		    <el-table-column
		      prop="createTime"
		      label="生成时间">
		    </el-table-column>
			<el-table-column
			  prop="address"
			  label="状态">
			  <template slot-scope="scope">
			  		<span style="display: inline-block;background:#e8f3ff;padding:2px 5px;border-radius:5px;color:#165dff" v-if="scope.row.generatedNum!=scope.row.num">{{scope.row.generatedNum}}/{{scope.row.num}}</span>
					<el-tag v-else type="success">已完成</el-tag>
					<!-- <span v-else style="display: inline-block;background:#e8ffea;padding:2px 5px;border-radius:5px;color:#00b42a">已完成</span> -->
			  </template>
			</el-table-column>
			<el-table-column
			  label="操作">
			  <template slot-scope="scope">
				  <el-button @click="fixedchengji(scope.row)" type="text" size="small">删除</el-button> 
				</template>
			</el-table-column>
		  </el-table>
		  <div style="margin-top:20px;" class="boxpagelist">
		  	<span class="colorGray">共{{tableData.length}}条数据</span>
		  	<el-pagination
		  	      @size-change="handleSizeChange"
		  	      @current-change="handleCurrentChange"
		  	      :current-page="pageIndex"
		  	      :page-sizes="[20, 50, 100]"
		  	      :page-size="pageSize"
		  	      layout="total, sizes, prev, pager, next, jumper"
		  		  background
		  	      :total="listTotal?listTotal:0">
		  	    </el-pagination>
		  </div>
	</div>
</template>

<script>
	import {navmarkpaperlist,navmarkpaperdelete} from '../../../api/scoreapi.js'
	export default{
		data(){
			return {
				tableData:[],
				pageIndex:1,
				pageSize:20,
				listTotal:'',
				schoolmark:''
			}
		},
		mounted() {
			localStorage.setItem('menuState', 2);
			let newtitle = decodeURIComponent(this.$route.query.con)
			this.titlecontent = JSON.parse(newtitle)
			this.markpaperlistclick(this.titlecontent.n5Id)
		},
		methods:{
			resorego(){
				this.markpaperlistclick(this.titlecontent.n5Id)
			},
			markpaperlistclick(id){
				let params={
					navId:id,
					pageIndex:this.pageIndex,
					pageSize:this.pageSize
				}
				navmarkpaperlist(params).then(res=>{
					console.info(res)
					if(res.code==0){
						this.tableData = res.data.list
						this.listTotal = res.data.total
					}else{
						this.$message({
							type: 'error',
							message: res.msg
						});
					}
				})
			},
			// 处理每页条数变化
			handleSizeChange(val){
				this.pageSize = val
				 this.markpaperlistclick(this.titlecontent.n5Id)
			},
			// 处理当前页码变化
			handleCurrentChange(val){
				this.pageIndex = val
				 this.markpaperlistclick(this.titlecontent.n5Id)
			},
			//删除
			fixedchengji(){
				let params={
					navId:this.titlecontent.n5Id
				}
				this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
				  confirmButtonText: '确定',
				  cancelButtonText: '取消',
				  type: 'warning'
				}).then(() => {
					navmarkpaperdelete(params).then(res=>{
						if(res.code==0){
							this.markpaperlistclick(this.titlecontent.n5Id)
							this.$message({
								type: 'success',
								message: res.msg
							});
						}else{
							this.$message({
								type: 'error',
								message: res.msg
							});
						}
					})
				}).catch(() => {
				  this.$message({
					type: 'info',
					message: '已取消删除'
				  });          
				});
			}
		}
	}
</script>

<style scoped>
	.boxmain h3{
		padding:20px 0;
		font-size:18px;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
	.boxmain{
		padding:30px;
	}
	.boxpagelist{
			  display: flex;
			  align-items: center;
	}
	.boxpagelist >>> .el-pagination__total{
			  display: none !important;
	}
	.colorGray{
			  font-size:12px;
			  color:#999;
	}
	.boxpagelist >>> .el-pagination__jump{
			  color:#999;
			  font-size:12px;
	}
	.boxpagelist >>> .el-pagination__sizes .boxpagelist >>> .el-input .boxpagelist >>> .el-input__inner{
			  font-size:12px;
	}
	.boxpagelist >>> .el-pagination.is-background  .boxpagelist >>> .el-pager li:not(.disabled).active{
			 background-color:#1664FF !important
	}
</style>